No records HTML

Description

You can alter the HTML in the no records message using the 'No records HTML' property.

images/noprop.png
The 'No records HTML' property

Clicking the button next to the No records HTML property opens the HTML editor. Here you can alter the font type, size, color, and text of the message.

images/norecord.png
Customized message

You can also use the HTML Editor load an image as the message.

images/norecord4.png
Adding an image to the Project
images/norecords3.png
Using an image for the 'no records'' message

Here is the html example used in the video, "Displaying a Custom Message in the List if the List has No Records" (see Videos section below.) The example below is run against some static CR-LF delimited field names without any records included as data.

<span style="color: red;"><b>There are no records in the list</b></style>

And here is the result:

images/norecords2.png

Specifying the 'No Records' Message Using JavaScript

JavaScript can be used to dynamically generate the message shown. To specify that the message to display is calculated using JavaScript, the message must be prefixed with javascript: directive.

For example, assume a local function called norecordsmessage was defined in the List Builder's Javascript tab.

You would set the No Records HTML to:

javascript:this.norecordsmessage()

The Javascript tab can be turn on in the List Builder to define functions at This object level. Functions defined on the List's Javascript tab will be stored with the List.

You can also include a5-item attributes in the message text. For example, assume you wanted to display a message if the user tapped on the no records message. Assume also that the message was to be returned by a local function called norecordsmessage(). Here is how this could be done:

First, define an item in the List Builder's Items tab (by turning on the optional Template Items tab (check the box at the bottom of the List Builder window.) For example, you could define an item called 'norecords' that displayed a message when clicked.

Then define the norecordsmessage function as follows:

var norecordsinlist = function () {
    return '<span a5-item="norecords">List has no records</span>';
};

Videos

Displaying a Custom Message in the List if the List has No Records

A common requirement in a List is to show a custom message if the List has no records.

The List control has built-in properties to make this easy. You can also automatically center the message horizontally and vertically in the List.

See Also